<template>
    <div id="p_task">

            随机有趣任务,挑战任务;
                <group>                
                    <swipeout>
                        <swipeout-item @on-open="actionOpen(item, index,2)" v-for="(item, index) in actionWeekEndArr" :key="index" ref="actionLife" >
                            <div slot="right-menu">
                                <swipeout-button @click.native="onDelClick('call',item,index)" type="warn">删除</swipeout-button>
                            </div>
                            <div slot="left-menu">
                                <swipeout-button type="primary">{{item.state!='done'?'完成':'取消完成'}}</swipeout-button>
                            </div>
                            <div slot="content" class="vux-1px-t">
                                <cell @click.native="" :title="item.title" :value="item.duration" :inline-desc="item.desc">
                                    <img slot="icon" :src="item.img || '/static/z39h5/img/logo.png'">
                                </cell>
                            </div>
                        </swipeout-item>
                    </swipeout>
                </group>
            </div>
</template>
<script>
import moment from "moment";

import api from '../../api';
import {
    mapState,
    mapActions
} from 'vuex'

import {
    Tab,
    TabItem,
    TransferDomDirective as TransferDom,
    Toast,
    Swipeout,
    SwipeoutItem,
    SwipeoutButton,
    XButton,
    PopupPicker,
    Group,
    Picker,
    Cell,
    Box,
      XInput,
      XTextarea,Flexbox, FlexboxItem,Datetime,
    ButtonTab,    ButtonTabItem,
    Checker,
    CheckerItem,    
    Scroller,
    Sticky
} from 'vux'

export default {
    directives: {
        TransferDom
    },
    components: {
    Tab,
    TabItem,
        Toast,
        Swipeout,
        SwipeoutItem,
        SwipeoutButton,
        XButton,
    PopupPicker,
    Group,
    Picker,
        Cell,
    Box,
      XInput,
      XTextarea,Flexbox, FlexboxItem,Datetime,
    ButtonTab,    ButtonTabItem,
    Checker,
    CheckerItem,
    Scroller,
    Sticky
    },
    computed: {
        ...mapState({
            uid: state => state.vux.uid
        })
    },
    watch: {
        
    },
    created() {
        
    },
    mounted: function() {
        
        this.actionWeekEndArr = [{title:"还未完成",desc:"点击赞助",duration:"",img:'/static/z39h5/img/logo.png'}];
    },
    methods: {
        taskGet(id){
            let _this = this;
            api.taskGet({id: id}).then(data => {
				if(data.errno !=0) return this.$vux.toast.show({text: data.errmsg ,type: 'warn'});
                
                    data = data.data;
              
                
            })
        },
        taskAdd(sdata){
            
        },
        taskSet(sdata){
            
        },
        taskDel(id){
            
        },
        changeTime(){
            console.log("asdf");
            this.visibility = true ;
        },
        onDelClick(type, item, index) {
            
        },
        handleEvents(type) {
            if (type == 'on-open') {
                this.swipeOpen = true;
            } else {
                this.swipeOpen = false;
            }
            console.log('event: ', type)
        },
        getData: function() {
            
        },
        ...mapActions([
            
        ])
    },
    data() {
        return {
              showPopupPicker: false,
            actionWeekEndArr:[] ,
            visibility: false ,
            showMonth:'',
            weekEdit:false ,
            data: {
                session: {}
            }
            
        }
    }
}

</script>
<style scoped>

.day-item {
  border: 1px solid #ececec;
  padding: 5px 15px;
}
.day-item-selected {
  border: 1px solid green;
}

.weui-cell img {
    max-width: 100px;
    height: 44px;
    margin-right: 10px;
    width: auto;
}
</style>
<style>
#p_task .weui-cells {
    margin-top: 0px;
}

#p_task .weui-search-bar:before {
    height: 0;
    border-top: 0;
}
/*#p_task .vux-tab .vux-tab-item{
    background: #fff;
}*/
#p_task .day  .vux-tab-selected {
    background: #eee;
    border-radius: 4px;
}
</style>
